import {
	mapState,
	mapGetters
} from 'vuex'

import {
	px_from_rpx,
	rpx_from_px,
} from "@/common/utils.js";


export default {
	computed: {
		...mapState("frame", ["sysDeviceInfo", "mpCapsuleInfo"]),
		...mapGetters("frame", [
			// 系统状态栏高度px-固定
			"sysStatusBarHeight", 
			// 系统导航栏高度45px,小程序会调整
			"sysNavgationBarHeight",
			
			// 自定义状态栏高度小程序下会有调整其他平台系统导航高度一样；
			"customStatusBarHeight",
			// 自定义导航栏固定45px；
			"customNavgationBarHeight",
			// 自定义 状态栏+导航栏
			 "customStatusNavgationHeight",
			
			// 小程序胶囊左边距离屏幕右边的间距rpx
			 "mpCapsuleLeftSpace_rpx",
			
		]),
	},
	onReady() {
		//非必要，防止 app.vue中onLaunch方法没有保存成功
		this.$store.dispatch("frame/appOnLaunch");
	},
	methods: {
		
		// 自定义顶部（状态栏+导航栏）如果不管小程序，那么无需看下面的方法
		// 如果你自定义顶部（状态栏+导航栏）导航栏高度和正常44px不一样，还想要让导航栏中的样式与小程序胶囊水平对齐；
		// 那么 你导航栏的高度使用你自己设置的navHeight，状态栏的高度建议使用此方法获取一下.
		// 这样页面顶部位置的高度 = 你的自定义导航栏navHeight + 此方法获取的高度 ； 
		//为适配小程序胶囊 根据 传的导航栏的高度 算出 状态栏的高度，导航栏 建议navHeight >= 88 (单位rpx) 
		getStatusBarHeightWithNavHeight(navHeight) {
			// #ifdef MP
			if (!this.mpCapsuleInfo) { 
				return this.sysStatusBarHeight
			}
			let capsule_center = rpx_from_px(this.mpCapsuleInfo.top) + rpx_from_px(this.mpCapsuleInfo.height) / 2.0;
			return capsule_center - navHeight / 2.0;
			// #endif

			// #ifndef MP
			return this.sysStatusBarHeight
			// #endif
		},

	}

}